<!DOCTYPE html>
<html>
<head lang="en">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="css/index2.css"/>
    <link rel="stylesheet" href="css/swiper.min.css">
    <!--<link rel="stylesheet" href="css/mycountry.css"/>-->
    <style>
        html{
            font-size: 345%;
        }
        html,body{
            max-width:540px;
            min-width: 320px;
            margin:0 auto;
            /*height:100%;*/
            overflow:auto;
            background: #ececec;
        }
        #seenews{
            position:fixed;
            top:0;
            bottom:0;
            left:0;
            right:0;
            max-width:540px;
            min-width: 320px;
            margin:0 auto;
            z-index: 1000;
            height:100%;
            width: 100%;
            box-sizing: border-box;
        }
        #seenewsheader{
            position: absolute;
            top:0;
            height:44px;
            width:100%;
            box-sizing: border-box;
            background: #b92b27;
        }
        #iframebox{
            position: absolute;
            /*top:144px;*/
            top:80px;
            bottom:0;
            left:0;
            right:0;
            overflow:auto;
            -webkit-overflow-scrolling: touch;
            overflow-y: scroll;
        }
        iframe{
            width:100%;
            height:100%;
            /*height:auto;*/
            box-sizing: border-box;
            overflow: auto;
        }
        #seenewsheader .lf{
            width:44px;
            height:44px;
            box-sizing: border-box;
            padding:0;
            margin:0;
            padding-left:15px;
        }
        .mweb_modal_back_button:after{
            left:18px;
        }
        #sharewaiting>div{
            width:80px;
            height:80px;
            background: rgba(53,53,53,0.5);
            margin:45% auto;
            line-height: 80px;
            text-align: center;
        }
        #sharewaiting>div>img{
            width:44px;
            height:44px;
            -webkit-animation:circle 1s infinite linear;
        }
        @-webkit-keyframes circle{
            0%{ transform:rotate(0deg); }
            100%{ transform:rotate(-360deg); }
        }
        /*滚动*/
        .row{
            overflow: hidden;
        }
        #box,#box1,#box2{
            height:44px;
        }
        .box{
            position: relative;
        }
        .box1,.box2{
            width: 100%;
            position: absolute;
        }
        .box2{
            left:100%;
        }
        .box2>p,.box1>p{
            float:left;
            width:100%;
            line-height: 44px;
            color:#fff;
        }
        /*二维码*/
        .gotoseeit{
            float: right;
            width: 1.15rem;
            /*height: .55rem;*/
            line-height: .55rem;
            /*margin: .3rem .15rem 0;*/
            margin: 0 .15rem 0;
            background-color: rgb(53,130,218);
            text-align: center;
        }

        #qrcode{
            max-width:540px;
            min-width: 320px;
            position:fixed;
            overflow: hidden;
            /*top:44px;*/
            height:100px;
            width:100%;
            box-sizing: border-box;
            text-align: center;
            background: #F84C4A;

        }
        #qrcode>div{
            position: relative;
            width:100%;
            height:100px;

            margin:0 auto;
            box-sizing: border-box;

        }
        #qrcode div.lf{
            margin-top:10px;
        }
        #qrcode>div>div:not(.lf){
            height:80px;
            padding-top:15px;
            text-align: left;
            box-sizing: border-box;
        }
        #qrcode img{
            height:80px;
            width:80px;
            margin:0 auto;
            /*position: absolute;*/
            /*top:50%;*/
            /*left:50%;*/
            /*transform: translate(-50%,-50%);*/
        }
        /*调整IFRAME*/
        #newsiframe{

            max-width: 540px;
            min-width: 320px;
        }
        /*小喇叭*/
        #iframegoback{
            width:44px;
            height:44px;
            /*background:url(img/horn.png) no-repeat center;*/
            background-size: 20px;
        }
        #iframegoback:after{
            display: none;
        }
        #fromuserimg,#friuserimg{
            border-radius: 5px;
        }
        #qrcode>div{
            position: absolute;
            left:0;
        }
        #qrcode .userimg>img{
            width:50px;
            height:50px;
        }
        /*#qrcode .userimg{*/
            /*margin-top:6px;*/
        /*}*/
        #fromusername,#friusername{
            text-align: center;
            height:24px;
            width:50px;
            line-height:24px;
            white-space:nowrap;
            text-overflow:ellipsis;
            -o-text-overflow:ellipsis;
            overflow: hidden;
            color:#fff;
        }
        .relalist div.showlist{
            /*height: .8rem;*/
            line-height: 1.6;

            padding-left:8px;
            white-space:nowrap;
            text-overflow:ellipsis;
            -o-text-overflow:ellipsis;
            overflow: hidden;
        }
        /*.relalist>div:first-child{*/
            /*padding-bottom:5px;*/
        /*}*/
        /*.relalist>div:last-child{*/
            /*padding-top:5px;*/
        /*}*/

        #nav1>.lf{
            overflow: hidden;
        }
        #nav1>.lf>.qrdiv{
            float: left;
            width:33%;
        }
        #nav1>.lf>.qrdiv>div{
            white-space:nowrap;
            text-overflow:ellipsis;
            -o-text-overflow:ellipsis;
            overflow: hidden;
        }
        .relalist div{
            cursor: pointer;
            color: #fff;

            font: 14px/1 -apple-system,"Helvetica Neue",Arial,"PingFang SC","Hiragino Sans GB",STHeiti,"Microsoft YaHei","Microsoft JhengHei","Source Han Sans SC","Noto Sans CJK SC","Source Han Sans CN","Noto Sans SC","Source Han Sans TC","Noto Sans CJK TC","WenQuanYi Micro Hei",SimSun,sans-serif;;
            font-size: 16px;
        }
        /*滚动修改*/
        .relalist{
            padding-top:10px;
        }
        #qrcode>div>div:not(.lf){
            padding-top:0;
        }
        #nav1,#nav2,#nav3{
            width: 100%;
            box-sizing: border-box;
            /*padding-left: 15px;*/
            /*padding-right:15px;*/
        }
        /**/
        #qrcode div.lf{
            float: left;
            margin: .18rem .25rem 0 .15rem;
            width: .8rem;
            /*height: .8rem;*/
            height:100%;
        }
        #qrcode div#nav1 .lf{
            width:100%;
        }
        .showlist{
            margin-right:1.55rem;
        }
        .relalist>div{
            position:relative;
        }
        .relalist .gotoseeit{
            position: absolute;
            top:3px;
            right:.15rem;
            height:20px;
            line-height:20px;
        }
        .userimg{
            text-align: center;
        }
    </style>
    <link rel="stylesheet" href="css/bannerQr2.css"/>
</head>
<body>
<!--新闻详情页-->
<div id="seenews" style="display:block;background:#fff;">
    <div id="qrcode">
        <div class="swiper-container" id="swiper-container">
            <!--二维码 -->
            <div id="gobackimg">
                <img src="img/gobackarr.png"/>
                <span>返回</span>
            </div>
            <div class="swiper-wrapper">
                <!--好友 -->
                <div class="swiper-slide" id="nav3">
                    <div class="lf box"></div>
                    <div class="lf">
                        <div class="userimg">
                            <img id="friuserimg" src="img/af8.png" alt=""/>
                        </div>
                        <div id="friusername"></div>
                    </div>
                    <div class="relalist">

                    </div>
                </div>
                <!-- 转发者-->
                <div class="swiper-slide"  id="nav2">
                    <div class="lf box"></div>
                    <div class="lf">
                        <div class="userimg">
                            <img id="fromuserimg" src="img/af8.png" alt=""/>
                        </div>
                        <div id="fromusername"></div>
                    </div>
                    <div class="relalist">

                    </div>
                </div>
                <!-- -->
                <div class="swiper-slide" id="nav1">
                    <div class="lf box"></div>
                    <div>
                        <div class="qrdiv">
                            <div class="userimg">
                                <img src="img/QRcode.jpg" alt=""/>
                            </div>
                            <div>关注二维码</div>
                        </div>
                        <div class="qrdiv">
                            <div class="userimg">
                                <img src="img/QRcode.jpg" alt=""/>
                            </div>
                            <div>安卓下载二维码</div>
                        </div>
                        <div class="qrdiv">
                            <div class="userimg">
                                <img src="img/QRcode.jpg" alt=""/>
                            </div>
                            <div>IOS下载二维码</div>
                        </div>
                    </div>

                </div>
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </div>
    <!-- 新闻区域-->
    <div id="iframebox" style="overflow: auto">
        <iframe id="newsiframe" src="" frameborder="0" scrolling="yes" style="overflow: auto"></iframe>
    </div>

</div>


<!--js-->
<script src="js/jquery-1.11.3.js"></script>
<script src="js/jquery.cookie.js"></script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<!--环信-->
<script type="text/javascript" src="sdk/webim.config.js"></script>
<script src="sdk/strophe.js"></script>
<script src="sdk/websdk-1.1.2.js"></script>

<script src="ftnjs/swiper.jquery.min.js"></script>
<script src="ftnjs/urlnote.js"></script>
<script src="js/weixinsharenews.js"></script>
</body>
</html>